<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>新增文章</title>
    <script type="text/javascript" src="./../../../static/js/include/_include-css.js"></script>
    <link href="./../../../static/plugins/colpick/css/colpick.css" rel="stylesheet" />

</head>

<body class="bg-gray">
    <div class="wrapper">
        <div class="wrapper-container">
            <div class="panel">
                <div class=" nav-tabs-easy">
                    <ul class="nav nav-tabs ">
                        <li class="active">
                            <a href="#base_setting" data-toggle="tab">基本信息</a>
                        </li>
                        <li>
                            <a href="#other_setting" data-toggle="tab">相关信息</a>
                        </li>
                    </ul>
                    <form class="form-horizontal">
                        <div class="panel-body tab-content">
                            <div class="tab-pane active" id="base_setting">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">文章标题：</label>
                                    <div class="col-sm-9">
                                        <div class="input-group">
                                            <input type="text" class="form-control" placeholder="">
                                            <span class="input-group-addon">
                                                <label class="checkbox-inline strong"><input type="checkbox">加粗</label>
                                            </span>
                                            <span class="input-group-addon" id="picker">
                                                <i class="fa fa-font"></i>
                                            </span>
                                        </div>
                                        <div class="help-block">
                                            <span class="text-warning">文章标题内容</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">所属栏目：</label>
                                    <div class="col-sm-9">
                                        <select class="select2 form-control">
                                            <option>请选择栏目</option>
                                            <option>新闻中心</option>
                                            <option>产品中心</option>
                                            <option>关于我们</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">文档属性：</label>
                                    <div class="col-sm-9">
                                        <div class="checkbox-inline">
                                            <label>
                                                <input type="checkbox" value="1">热门[hot]
                                            </label>
                                        </div>
                                        <div class="checkbox-inline">
                                            <label>
                                                <input type="checkbox" value="1">推荐[good]
                                            </label>
                                        </div>
                                        <div class="checkbox-inline">
                                            <label>
                                                <input type="checkbox" value="1">置顶[top]
                                            </label>
                                        </div>
                                        <div class="checkbox-inline">
                                            <label>
                                                <input type="checkbox" value="1">头条[head]
                                            </label>
                                        </div>
                                        <div class="checkbox-inline">
                                            <label>
                                                <input type="checkbox" value="1">链接[link]
                                            </label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">缩略图：</label>
                                    <div class="col-sm-9">
                                        <input type="text" class="form-control" placeholder="">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">文章标签：</label>
                                    <div class="col-sm-9">
                                        <input class="form-control tags-input"  type="text"  data-height="68px" placeholder="请输入标签" value="">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">文章内容：</label>
                                    <div class="col-sm-9">
                                        <textarea class="form-control" placeholder=""></textarea>
                                    </div>
                                </div>

                            </div>
                            <div class="tab-pane" id="other_setting">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">SEO标题：</label>
                                    <div class="col-sm-9">
                                        <input class="form-control" type="text" name="seoTitle"
                                               id="seoTitle" placeholder="请输入SEO标题">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">SEO关键字：</label>
                                    <div class="col-sm-9">
                                        <input class="form-control" type="text" name="seoKeys"
                                               id="seoKeys" placeholder="请输入SEO关键字">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">SEO描述：</label>
                                    <div class="col-sm-9">
                                        <textarea class="form-control " rows="4" name="seoDescription"
                                                  id="seoDescription" placeholder="请输入SEO描述"></textarea>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">作者：</label>
                                    <div class="col-sm-9">
                                        <input class="form-control" type="text" name="author"
                                               id="author" value="超级管理员">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">浏览量：</label>
                                    <div class="col-sm-9">
                                        <input class="form-control" type="number" name="viewNum"
                                               id="viewNum" value="0">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">发布时间：</label>
                                    <div class="col-sm-9">
                                        <div class="input-group">
                                            <input type="text" data-msg="请选择发布时间" readonly
                                                   class="form-control time-input bg-white" data-type="datetime"
                                                   name="releaseTime" id="releaseTime"/>
                                            <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-2 control-label is-required">排序：</label>
                                    <div class="col-sm-9">
                                        <input class="form-control required" type="number" name="sort" value="100"
                                               id="sort" placeholder="请输入排序" data-msg="请输入排序">
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-xs-9 col-xs-offset-2">
                                    <a class="btn btn-primary"><i class="fa fa-fw fa-check"></i>保存信息</a>
                                    <a class="btn btn-danger" href="javascript:;" onclick="$.modal.closeTab()"><i
                                            class="fa fa-fw fa-remove"></i>关闭页面</a>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="./../../../static/js/include/_include-js.js"></script>
    <script src="./../../../static/plugins/colpick/js/colpick.js"></script>
    <script type="text/javascript">
        $('#picker').colpick({
            layout: 'hex',
            submit: 0,
            onChange: function (hsb, hex, rgb, el, bySetColor) {
                $(el).css('color', '#' + hex);
            }
        }).keyup(function () {
            $(this).colpickSetColor(this.value);
        });
    </script>

</body>

</html>